<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
	<title>幸运奖</title>
	<link rel="stylesheet" href="css/base.css">
	<link rel="stylesheet" href="css/prize.css">
</head>
<body>
	<div class="prize">
		<div class="prize_type">幸运奖</div>
		
		<div class="prize_con1"  class="main">
			<ul>

				<li>
					<div class="prizec_num2 title">幸运奖</div>
				</li>

			</ul>
		</div>
	</div>
</body>
<script>
			var data_pre=[
				'小米移动电源',
				'小米智能夜灯',
				'香薰',
				'靠垫猫咪',
				'靠垫纯色',
				'无线鼠标',
				'U形枕',
				'个性礼盒',
				'茶壶套装（钻石白）',
				'茶壶套装（天空蓝）',
				'小夜灯',
				'减压葡萄',
				'吃鸡神器',
				'减压毛豆',
				'相框（白色）',
				'相框（橡木）',
				'相框（黑色）',
				'鼠标垫（方形抱小熊）',
				'鼠标垫（头型粉色款）',
				'鼠标垫（头型黑色款）',
				'毛巾',
				'袜子',
				'手套',
				'指尖陀螺'
			],
			    data=[''],
				data1=[],
				timer=null,
				flag=0;
			var rewardlist={
				'小米移动电源':1,
				'小米智能夜灯':1,
				'香薰':2,
				'靠垫猫咪':1,
				'靠垫纯色':1,
				'无线鼠标':2,
				'U形枕':1,
				'个性礼盒':1,
				'茶壶套装（钻石白）':1,
				'茶壶套装（天空蓝）':1,
				'小夜灯':2,
				'减压葡萄':1,
				'吃鸡神器':1,
				'减压毛豆':1,
				'相框（白色）':1,
				'相框（橡木）':1,
				'相框（黑色）':1,
				'鼠标垫（方形抱小熊）':1,
				'鼠标垫（头型粉色款）':2,
				'鼠标垫（头型黑色款）':1,
				'毛巾':10,
				'袜子':10,
				'手套':2,
				'指尖陀螺':1
			}
			var rewardNum = 1;
			var rewardPerNum = 1;
			var fl = 100;
			
			//封装一个方法拿到 通过class拿到的标签 注意拿到的时候是个数组对象，记得最后[0]，取一下第一个对象
			function getByClass(clsName,parent){
				var oParent=parent?document.getElementById(parent):document,
					eles=[],
					elements=oParent.getElementsByTagName('*');

				for(var i=0;i<elements.length;i++){
					if(elements[i].className == clsName){
						eles.push(elements[i]);
					}
				}
				return eles;
			}
			
			//函数开始
			window.onload=function(){
				var oTitle=$(".title");

			//键盘事件 针对的是整个document
			document.onkeyup=fnkey;
			
			function fnplay(){
				//var that=this;//这里指的是begin这个按钮 这里暂时不考虑这个。
				//每个开始之前关闭一下定时器，不然每次按click的时候容易加快速度，以至于整个浏览器容易奔溃  
					clearInterval(timer);

					data = [];
					
					for(var item in rewardlist)
					{
						if(rewardlist[item]>0){
							data.push(item);
						}
					}

					if(data.length<1){
						$(".prize_type")[0].innerHTML=	"经理发红包吧";		
						for(var i = 0;i < oTitle.length;i++){
							oTitle[i].innerHTML="奖没了";
						}
						return;
					 }

					//定义一个定时器
					timer=setInterval(function(){
						//Math.random()拿到的是0-1之前的数字，去乘数组的长度 再取整数可以拿到想要的数组下标
						var random=Math.floor(Math.random()*data_pre.length); //floor去取整
						//把拿到的数组的值写进去
						for(var i = 0;i < oTitle.length;i++){
							oTitle[i].innerHTML=data_pre[random];
						}
					},50);
				}

				function fnstop(){

					 if(data.length<1){
						$(".prize_type")[0].innerHTML=	"经理发红包吧";		
						for(var i = 0;i < oTitle.length;i++){
							oTitle[i].innerHTML="奖没了";
						}		
						return;
					 }

					 data1 = []
					
					 var random=Math.floor(Math.random()*data.length);
					 data1.push(data[random]);
		 			
  					 var free = rewardlist[data[random]]-1;
					 rewardlist[data[random]] = free;

					 clearInterval(timer);
				
					 for(var i = 0;i < oTitle.length;i++){
						 console.log(data1[i])
						 oTitle[i].innerHTML=data1[i];
					 }
						
				}
				
				function fnkey(event){
					if(data.length < 1){
						$(".prize_type")[0].innerHTML=	"经理发红包吧";		
						for(var i = 0;i < oTitle.length;i++){
							oTitle[i].innerHTML="奖没了";
						}
						return;
					 }
					console.log(event.keyCode);
					event=event ||window.event;
					if(event.keyCode == 13 && fl>0){  //当按下回车键的时候
						//一开始是0的状态，我们改变。
						if(flag == 0 && fl>0){
							fnplay();
							//设置为1的状态，停止改变
							flag =1;
						}else{
							fnstop();
							flag=0;
							fl--;
						}
					}
				}
			}
  </script>
</html>